<template>
  <div>
    <BasicModal
      @register="registerModal"
      @open-change="change"
      title="发起审核"
      @ok="handleSubmit"
      width="400px"
      :destroyOnClose="true"
    >
      <div class="audit-content">
        <RadioGroup v-model:value="selectType" name="radioGroup">
          <Radio value="1">全部数据</Radio>
          <Radio value="2">当前选中数据</Radio>
        </RadioGroup>
      </div>
    </BasicModal>

    <FlowDetail
      v-model:visible="flowDetailVisible"
      ref="flowDetail"
      @change="change"
      style="background: #fff"
    />
  </div>
</template>

<script setup lang="ts">
  import { onMounted, ref } from 'vue';
  import { cloneDeep } from 'lodash-es';
  import { Radio, RadioGroup } from 'ant-design-vue';
  import FlowDetail from '/@/components/FlowTable/src/components/FlowDetail.vue';
  import { BasicModal, useModal } from '/@/components/Modal';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { taskValidateAudit } from '/@/api/jd/water-box';

  const props = defineProps({
    allData: {
      type: Object,
      default: () => {},
    },
  });

  const emit = defineEmits(['change']);

  const { createMessage } = useMessage();

  let selectRows: any[] = [];

  const selectType = ref('');

  const flowDetailVisible = ref(false);

  const flowDetail = ref<any>(null);

  const [registerModal, { openModal, closeModal }] = useModal();

  const handleSubmit = async () => {
    const nowColumn = props.allData.btnItem?.tabFn.getDataSource();
    console.log(nowColumn);
    if (!selectType.value) {
      createMessage.warn('请选择审核数据类型！');
      return;
    }

    if (selectRows.length === 0 && selectType.value === '2') {
      createMessage.warn('当前未选择需要发起审核的数据');
      return;
    }

    let params = cloneDeep(selectRows);
    if (selectType.value == '1') {
      params = [];
    }
    await taskValidateAudit({
      waterCodes: params,
      taskId: nowColumn[0].task_id,
      type: nowColumn[0].water_meter_status,
    });
    closeModal();
    openFlowListSuccess(props.allData?.paramsObj?.templateId);
  };

  const change = (data, type?) => {
    if (flowDetailVisible.value) return;
    selectType.value = '';
    if (type === 'send') {
      props.allData.btnItem?.tabFn.reload();
    }

    emit('change', data);
  };

  function openFlowListSuccess(id) {
    flowDetailVisible.value = true;
    if (selectType.value == '1') {
      const items = props.allData.btnItem?.tabFn.getDataSource()[0];
      selectRows = [
        {
          TYPE: selectType.value,
          task_id: items.task_id,
          apply_id: items.apply_id,
          water_meter_status: items.water_meter_status,
        },
      ];
    }

    if (flowDetail.value) {
      delete props.allData.btnItem.record;
      flowDetail.value?.openPage(true, {
        templateId: id,
        ...props.allData?.btnItem,
        record_data: selectRows,
        fieldsMap: selectRows,
        isCheck: true,
      });
    }
  }

  onMounted(() => {
    selectRows = props.allData.btnItem?.tabFn.getSelectRows() || [];

    if (!props.allData.btnItem?.tabFn.getDataSource().length) {
      createMessage.warn('当前不存在数据供给审核');
      change(false);
      return;
    }
    openModal(true);
  });
</script>

<style lang="less" scoped>
  .audit-content {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 200px;
  }
</style>
